<ui:composition template="../principal.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:define name="principal">
        <h2>Pacientes</h2>
        <div id="titulo-inicial">
            <h3>Escolha uma opção para Pacientes</h3>
            <h:graphicImage id="separador-conteudo" library="images" name="separador-conteudo.png"/>
            <br/>
        </div>
        <h:form>
            <h:panelGrid columns="5" styleClass="sub-opcoes">
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'AD'}" >  
                    <h:link outcome="../user-master/menuMaster.xhtml">
                        <h:graphicImage library="images" name="icones/inicio2.png"/>
                        <br/>
                        <h:outputText value="Painel"/>
                    </h:link>
                </c:if>
                <c:if test="#{loginMB.dentista.contaUsuario.tipo == 'DE'}" >  
                    <h:link outcome="../user-simple/menuDentista.xhtml">
                        <h:graphicImage library="images" name="icones/inicio2.png"/>
                        <br/>
                        <h:outputText value="Painel"/>
                    </h:link>  
                </c:if>
                <h:link outcome="gerenciarPaciente.xhtml">
                    <h:graphicImage library="images" name="icones/adcionar-paciente.png"/>
                    <br/>
                    <h:outputText value="Gerenciar"/>
                </h:link>
                <h:link outcome="gerenciarOdontograma.xhtml">
                    <h:graphicImage library="images" name="icones/odontograma.png"/>
                    <br/>
                    <h:outputText value="Odontograma"/>
                </h:link>
                <h:link outcome="gerenciarAnamnese.xhtml">
                    <h:graphicImage library="images" name="icones/anamnese.png"/>
                    <br/>
                    <h:outputText value="Anamnese"/>
                </h:link>
                <h:outputText value=""/>
            </h:panelGrid>
        </h:form>

        <h:form id="grafico">
            <p:barChart id="basic" value="#{adminPacienteMB.categoryModel}" legendPosition="ne" seriesColors="4E6F1C" styleClass="grafico" 
                        animate="true" title="Pacientes por quantidade de Tratamentos em Aberto">
                <p:ajax event="itemSelect" listener="#{adminPacienteMB.itemSelect}" update=":dados" oncomplete="pacienteDialog.show()" />
            </p:barChart> 
        </h:form>

        <h:form id="dados">
            <p:dialog header="Detalhes do Paciente" widgetVar="pacienteDialog" resizable="false" id="pacienteDlg" dynamic="true" 
                      showEffect="fade" hideEffect="fade" modal="true" >

                <p:tabView id="tabView" effect="fade" effectDuration="normal">
                    <p:tab id="tba1" title="Dados Cadastrais">
                        <h:panelGrid columns="2" cellpadding="10" width="600">
                            <h:graphicImage library="pacientes" name="#{adminPacienteMB.pacienteSelecionado.foto}" class="img-pessoa"/>
                            <h:panelGrid columns="2" cellspacing="4"> 

                                <h:outputText value="NOME: " styleClass="rotulo" />
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.nome} #{adminPacienteMB.pacienteSelecionado.sobrenome}" style="font-weight:bold"/>
                                <h:outputText value="DATA DE NASCIMENTO: " styleClass="rotulo" />
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.data_nascimento}"  style="font-weight:bold">
                                    <f:convertDateTime pattern="dd/MM/yyyy"/>
                                </h:outputText> 
                                <h:outputText value="SEXO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.sexo}" style="font-weight:bold"/>
                                <h:outputText value="PROFISSÃO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.profissao}" style="font-weight:bold"/>
                                <h:outputText value="CPF: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.cpf}" style="font-weight:bold"/>
                                <h:outputText value="RG: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.rg}" style="font-weight:bold"/>
                            </h:panelGrid>
                        </h:panelGrid>
                    </p:tab>
                    <p:tab id="tba2" title="Endereço">
                        <h:panelGrid columns="2" cellpadding="10" width="600">
                            <h:graphicImage library="pacientes" name="#{adminPacienteMB.pacienteSelecionado.foto}" class="img-pessoa"/>
                            <h:panelGrid columns="2" cellspacing="4">
                                <h:outputText value="LOGRADOURO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.logradouro}" style="font-weight:bold"/>
                                <h:outputText value="NUMERO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.numero}" style="font-weight:bold"/>
                                <h:outputText value="" />
                                <h:outputText value="" />

                                <h:outputText value="COMPLEMENTO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.complemento}" style="font-weight:bold"/>
                                <h:outputText value="BAIRRO: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.bairro}" style="font-weight:bold"/>
                                <h:outputText value="CEP: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.cep}" style="font-weight:bold"/>
                                <h:outputText value="UF: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.uf}" style="font-weight:bold"/>
                                <h:outputText value="CIDADE: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.endereco.cidade}" style="font-weight:bold"/>
                            </h:panelGrid>
                        </h:panelGrid>
                    </p:tab>
                    <p:tab id="tba3" title="Contato">
                        <h:panelGrid columns="2" cellpadding="10" width="600">
                            <h:graphicImage library="pacientes" name="#{adminPacienteMB.pacienteSelecionado.foto}" class="img-pessoa"/>
                            <h:panelGrid columns="2" cellspacing="4">
                                <h:outputText value="EMAIL: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.contato.email}" style="font-weight:bold"/>
                                <h:outputText value="TELEFONE: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.contato.telefone}" style="font-weight:bold"/>
                                <h:outputText value="CELULAR: " styleClass="rotulo"/>
                                <h:outputText value="#{adminPacienteMB.pacienteSelecionado.contato.celular}" style="font-weight:bold"/>
                            </h:panelGrid>
                        </h:panelGrid>
                    </p:tab>
                    <p:tab id="tba4" title="Dados Clínicos">
                        <h:panelGrid columns="2" cellpadding="10" width="600">
                            <h:graphicImage library="pacientes" name="#{adminPacienteMB.pacienteSelecionado.foto}" class="img-pessoa"/>
                            <h:panelGrid columns="2" cellspacing="4">
                                <h:panelGrid columns="2" cellspacing="4">
                                    <h:outputText value="COR DOS DENTES: " styleClass="rotulo"/>
                                    <h:outputText value="#{adminPacienteMB.pacienteSelecionado.cor_dentes}" style="font-weight:bold"/>
                                    <h:outputText value="ULTIMO TRATAMENTO: " styleClass="rotulo"/>
                                    <h:outputText value="#{adminPacienteMB.pacienteSelecionado.ultimo_tratamento}" style="font-weight:bold" >
                                        <f:convertDateTime pattern="dd/MM/yyyy"/>
                                    </h:outputText>
                                    <h:outputText value="DATA DO CADASTRO: " styleClass="rotulo"/>
                                    <h:outputText value="#{adminPacienteMB.pacienteSelecionado.data_cadastro}" style="font-weight:bold" >
                                        <f:convertDateTime pattern="dd/MM/yyyy"/>
                                    </h:outputText>
                                </h:panelGrid>
                            </h:panelGrid>
                        </h:panelGrid>

                    </p:tab>
                </p:tabView>
            </p:dialog>
        </h:form>

    </ui:define>
</ui:composition>


